import Logo from "@assets/logo.png";
import EnhanceUseNavigate from "@plugin/EnhanceUseNavigate";
import React, { Component } from "react";
import styles from "./index.module.scss";
class Index extends Component {
  constructor(props) {
    super(props);

    this.state = {
      activityRulesStatus: false,
    };
  }

  async componentDidMount() {}

  showActivityRules = () => {
    this.setState({
      activityRulesStatus: true,
    });
  };

  hideActivityRules = () => {
    this.setState({
      activityRulesStatus: false,
    });
  };

  render() {
    const { backgroundImage, children, hideLogo, bigLogo } = this.props;
    return (
      <>
        <div
          className={styles.background_container}
          style={{ backgroundImage: `url(${backgroundImage})` }}
        >
          {hideLogo ? (
            ""
          ) : (
            <img
              src={Logo}
              alt="kinder"
              className={`${styles.logo} ${bigLogo ? styles.bigLogo : ""}`}
            />
          )}

          {children}
        </div>
      </>
    );
  }
}

export default EnhanceUseNavigate(Index);
